<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
		<theme-navbar :is-white="false" title="应知应会" :custom-back="goBack" style="z-index: 99999"></theme-navbar>
		<!-- #endif -->
    <view class="yzyh-search-lay" :style="{'top': isHideNav ? 0 : '44px'}">
      <u-search
        class="yzyh-search"
        shape="round"
        :clearabled="true"
        :showAction="true"
        actionText="搜索"
        :animation="true"
        placeholder="请输入关键词"
        v-model="name"
        @custom="toSearchList"
      ></u-search>
    </view>
    <view class="content u-page">
      <me-table
        :i="0"
        :index="0"
        :top="110"
        :load-data="loadData"
        :height="getListViewHeight()"
        :init-load="false"
        ref="mescrollItem0"
      >
        <view class="list-lay" slot-scope="d">
          <view class="content-title-lay content-title-wrap">
            <view class="title-wrap" @click="toDetail(d.data)">
              <view style="margin-right: 5px">
                <u-icon color="#fcbd71" size="32" name="file-text"></u-icon>
              </view>
              <view class="content-title">     
                <text>{{ d.data.knowledgeTitle || '' }}</text>
              </view>
            </view>
            <view>
              <u-tag :text="d.data.knowledgeTypeName"></u-tag>
            </view>
          </view>
          <!-- 发布人： -->
          <!-- <view class="content-title-lay other-wrap">
            <text>{{ d.data.creatorName || '' }}</text>
          </view> -->
          <!-- 发布时间： -->
          <view class="content-title-lay other-wrap">
            <text>{{ d.data.releaseTime || '' }}</text>
          </view>
          <!-- 发布单位： -->
          <view class="content-title-lay other-wrap">
            <text>{{ d.data.ownOrgName || '' }}</text>
          </view>
          <!-- <view class="content-title-lay other-wrap">
            <text>发布内容：{{ d.data.releaseContent || '' }}</text>
          </view> -->
        </view>
      </me-table>
    </view>
  </view>
</template>

<script>
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import meTable from '@/components/me-table.vue';
import superviseService from '@/service/supervision/supervision.service.js';
export default {
  components: { meTable },
  mixins: [ MescrollMoreMixin ],
  data() {
    return {
      name: ''
    };
  },
  onLoad(opt){

  },
  methods: {
    getListViewHeight() {
        let p = this.$u.sys().windowHeight - 44 - 48 - uni.upx2px(10) - this.$u.sys().statusBarHeight;
        // #ifdef H5-DINGDING || H5-WECHAT
        p = this.$u.sys().windowHeight - uni.upx2px(10) - 48 - this.$u.sys().statusBarHeight;
        // #endif
        return p  + "px";
    },
    // 列表数据请求
    loadData(page) {
        let param = {
          name: this.name
        };
        return new Promise((resolve) => {
          superviseService.getKnowledgeLst(page.num, page.size, param).then(res => {
            if (res.success) {
              resolve({
                count: res.count,
                data: [...res.data,],
              });
            } else {
              resolve({
                count: 0,
                data: [],
              })
            }
          }).catch(err => {
            resolve({
              count: 0,
              data: [],
            });
          });
        })
    },
    // 查询
    toSearchList () {
      // this.getMescroll(0).triggerDownScroll();
      if (this.$u.test.isEmpty(this.name)) {
        this.$u.toast('请输入关键字');
        return;
      }
      this.$refs['mescrollItem0'].refresh();
    },
    // 跳转详情
    toDetail (data) {
      this.$u.route({
        url: "pages/supervision/yzyhDetail",
        params: {
          knowledgeUuid: data.knowledgeUuid
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
  .page{
    padding: 0;
  }
  .yzyh-search-lay {
		background-color: #fff;
		position: fixed;
		z-index: 999;
		width: 100%;
		overflow: hidden;
	}
  .yzyh-search {
		padding: $cm-search-padding-row $cm-search-padding-column;
	}
  .content {
		background-color: #F3F4F5 ;
    min-height: 100%;
	}
	.list-lay{
		// border-bottom: 2rpx solid $u-border-color;
		padding: 20rpx 20rpx;
		background-color: #FFF;
    margin: 20rpx;
    border-radius: 15px;
	}
  .title-wrap {
    display: flex;
    align-items: center;
  }
  .other-wrap {
    margin-left: 20px;
  }
  .content-title {
    font-weight: 600;
    font-size: 16px;
    color: black;
  }
  .content-title-lay {
    padding:5px 3px;
  }
  .content-title-wrap {
    display: flex;
    justify-content: space-between;
  }
</style>